<template>
	<view class="text-26">
		<view style="margin-top: 40rpx;">无异常信息</view>
		<view v-if="yiChangData.length">
			<view class="text-red yiTips">以下异常将会影响节点跑量，请尽快调整</view>
			<view>
				<view class="abnormalMain" v-for="(item,index) in yiChangData">
					<view class="flex-between abnormalItem">
						<view class="text-blue">异常内容</view>
						<view>设备离线</view>
					</view>
					<view class="flex-between abnormalItem">
						<view class="text-blue">异常时间</view>
						<view>2024-08-28 18:58:49</view>
					</view>
					<view class="flex-between abnormalItem">
						<view class="text-blue">异常详情</view>
						<view>设备离线</view>
					</view>
					<view class="flex-between abnormalItem">
						<view class="text-blue">期待动作</view>
						<view>请检查节点网络状态</view>
					</view>

				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive,
		onMounted,
		inject,
		defineProps
	} from 'vue';

	import * as api from "@/utils/api.js"

	// 接收异常数据
	const props = defineProps({
		yiChangData: {
			type: Array,
			default: [],
		}
	})
	let imageUrl = ref("");
	onMounted(() => {
		// 全局变量引入
		const globalData = inject('globalData');
		imageUrl.value = globalData.value.imgOssUrl;
	})
</script>

<style scoped>
	.abnormalMain {
		border-bottom: 2rpx solid #1F1757;
		margin-bottom: 20rpx;
	}

	.abnormalItem {
		margin-bottom: 20rpx;
	}

	.yiTips {
		padding: 30rpx 0;
		box-sizing: border-box;
	}

	.netHeight {
		line-height: 60rpx;
	}

	.networkKa {
		padding: 20rpx;
		box-shadow: inset 0rpx 0rpx 32rpx 14rpx rgba(43, 23, 147, 0.59);
		border-radius: 8rpx;
		margin: 20rpx 0 20rpx 0;
	}

	.copyIcon {
		width: 40rpx;
		height: 40rpx;
		margin-right: 10rpx;
	}
</style>